<div class="da-list-wrap">
  <div class="da-content-banner">
    <d-breadcrumb>
      <d-breadcrumb-item><a routerLink="/">{{ 'system.breadcrumb.home' | translate }}</a></d-breadcrumb-item>
      <d-breadcrumb-item>{{ 'system.breadcrumb.ReviewFlowRoles' | translate }}</d-breadcrumb-item>
    </d-breadcrumb>
  </div>
  <div class="da-content-wrapper">
    <div class="da-list-container">
      <div class="da-list-header">
        <d-row>
          <d-col [dSpan]="24">
            <div class="btn-group">
              <d-button bsstyle="primaryBtn" (btnClick)="AddReviewRoles()">
                <i class="icon icon-add me-2"></i>新增
              </d-button>
            </div>
          </d-col>
        </d-row>
      </div>
      <div class="list-content">
        <d-data-table [lazy]="true" [dataSource]="ReviewRoles" [scrollable]="true" [fixHeader]="true"
          [tableOverflowType]="'auto'" [scrollable]="true" [resizeable]="true" [tableWidthConfig]="tableWidthConfig">
          <thead dTableHead>
            <tr dTableRow>
              <th dHeadCell [fixedLeft]="'0px'">
                <span>操作</span>
              </th>
              <th dHeadCell *ngFor="let colOption of dataTableOptions.columns">{{ colOption.header }}</th>
            </tr>
          </thead>
          <tbody dTableBody>
            <ng-template let-rowItem="rowItem" let-rowIndex="rowIndex">
              <tr dTableRow>
                <td dTableCell [fixedLeft]="'0px'" [rowItem]="rowItem">
                  <span (click)="EditReviewRoles(rowItem)"><a class="devui-link">编辑</a></span>
                  <span class="ms-3" (click)="delete(rowItem.approvalGroupId)"><a
                      class="devui-link-danger">删除</a></span>
                </td>
                <td dTableCell [rowItem]="rowItem">{{rowItem?.name}}</td>
                <td dTableCell [rowItem]="rowItem"><span
                    *ngFor="let user of rowItem.users; let isLast=last">{{user.name}}{{isLast ? '' :
                    '，&nbsp;&nbsp;'}}</span></td>
              </tr>
            </ng-template>
          </tbody>
        </d-data-table>
      </div>
      <div class="page-footer">
        <div>
        </div>
        <d-pagination [size]="'sm'" [canViewTotal]="true" [canChangePageSize]="true" [canJumpPage]="true" [maxItems]="5"
          [total]="this.pager.total" [pageSizeOptions]="this.pageSizeOptions" [(pageSize)]="pager.pageSize"
          [(pageIndex)]="pager.pageIndex" (pageIndexChange)="pageIndexChange($event)"
          (pageSizeChange)="pageSizeChange($event)">
        </d-pagination>
      </div>
    </div>
  </div>
</div>
<d-toast [value]="msgs" [life]="2000" [styleClass]="'custom-class'" [style]="{ left: '50%',top:'10px' }"></d-toast>
